<template>
    <div class="current">
        <div class="flag item">{{period}}期</div>
        <div class="gold item">可用金币：{{info.gold}}</div>
        <div class="res item">输赢：<span>{{info.profit>0?'+':''}}{{info.profit}}</span></div>
        <div class="end item">{{timerName}}：{{timer | to_time}}</div>
    </div>
</template>

<script>
    import {sec_to_time} from "../../utils/tool";

    export default {
        name: "new",
        props: ['data', 'info'],
        data () {
            return {
                timer: 0,
                timerName: '距封盘',
                period:null
            }
        },
        watch: {
            data(val) {
                this.period = val.period
                this.start(val)
            }
        },
        filters: {
            to_time(v) {
                return sec_to_time(v)
            }
        },
        methods: {
            start (data) {
                this.timer = data.after
                this.timerName = '距封盘'
                this.$emit('allowEvent', true); // 允许下单

                if (this.timer < 0) {
                    this.timer = 80 - Math.abs(this.timer)
                }

                let interval = window.setInterval(() => {
                    if (--this.timer > 0){
                        if (parseInt(this.timer) > 240 || parseInt(this.timer) <= 10) {
                            this.$emit('allowEvent', false); // 不允许下单
                        }
                    } else {
                        this.timerName = '距开奖';
                        this.$emit('getAwardDataEvent', true)
                        window.clearInterval(interval)
                    }
                }, 1000)



/*
                if (this.timer < 0) {
                    let timer = 0
                    let correctInterval = window.setInterval(() => {
                        timer++
                        if (timer % 5 === 0) {
                            this.$emit('getAwardDataEvent', true)
                            window.clearInterval(correctInterval)
                        }
                    }, 1000)
                }

                let interval = window.setInterval(() => {
                    if (--this.timer <= 0) {
                        window.clearInterval(interval)
                        this.openPrize(60)
                    } else {
                        if (parseInt(this.timer) > 300) {
                            this.$emit('allowEvent', false); // 不允许下单
                        }

                        if (parseInt(this.timer) <= 10) {
                            this.$emit('allowEvent', false); // 不允许下单
                        }
                    }
                }, 1000)*/

            },
            openPrize (timer) {
                this.timer = timer
                if (this.timer >= 0) {
                    this.timerName = '距开奖'
                } else {
                    this.timerName = '距开盘'
                }
                this.$emit('allowEvent', false); // 不允许下单
                let interval = window.setInterval(() => {
                    if ( -- this.timer <= 0) {
                        window.clearInterval(interval)
                    } else {
                        if (this.timer === 1) {
                            this.$emit('getAwardDataEvent', true)
                        }
                    }
                }, 1000)
            }
        }
    }
</script>

<style scoped lang="less">
    @import "../../assets/css/bases";
    .current {
        width: 100%;
        display: flex;
        font-size: .9rem;
        background: #f2f2f2;
        justify-content: space-between;
        padding: 10px 5px;
        flex-wrap: wrap;
        .item {
            padding-right: 10px;
        }
        .item.res span{
            color: @error;
        }
    }

    @media screen and (max-width: 320px){
        font-size: 0.85rem;
    }

    @media screen and (min-width: 320px) and (max-width: 375px){

    }
</style>